<template>
  <a-modal
    v-model:open="open"
    title="问卷详情"
    :footer="null"
    :maskClosable="false"
    :width="800"
    :bodyStyle="{ height: '500px', overflow: 'hidden auto', padding: '0px 24px 20px' }"
  >
    <template v-if="formData">
      <tform :formData="formData" :disabled="true" />
    </template>
    <template v-else>
      <div style="display: flex; align-items: center; justify-content: center; height: 100%">
        <a-empty />
      </div>
    </template>
  </a-modal>
</template>
<script setup lang="ts">
import tform from '@/components/ConditionForm/index.vue'
import { ref, reactive, onMounted } from 'vue'

const open = ref(false)
const formData = ref()

const init = (data) => {
  open.value = true

  const questionnaireInfoVO = data.questionnaireInfoVO
  const questionData = JSON.parse(questionnaireInfoVO.content)
  const patientQuestionnaireAnswerVO = data.patientQuestionnaireAnswerVO

  questionData.forEach((v) => {
    v.list.forEach((u) => {
      const item = patientQuestionnaireAnswerVO.filter((w) => {
        return w.questionId === u.id
      })

      if (item && item.length === 1) {
        u.value = item[0].content
        u.inputText = item[0].content
      } else if (item && item.length > 1) {
        const checkData: any = []
        item.forEach((w) => {
          checkData.push(w.content)
        })
        u.value = checkData.join(',')
        u.inputText = u.value
      }
    })
  })
  console.log(questionData)
  formData.value = questionData
}

defineExpose({
  init
})
</script>
<style lang="less" scoped></style>
